import { Toast, NavBar } from 'react-vant';
function App() {

  return (
    <div>
      <NavBar
        title="系统通知"
        leftText=""
        rightText="..."
        onClickLeft={() => Toast('返回')}
        onClickRight={() => Toast('按钮')}
      />
      <p style={{ fontSize: '15px', textAlign: 'center' }}>12-25 17:52</p>
      <dl style={{ display: "flex", justifyContent: "space-around", alignItems: "center" }}>
        <dt>
          <img style={{ width: '50px', height: '50px' }} src="http://172.16.10.111:5886/static/img/head-icon2.png" alt="" />
        </dt>
        <dd style={{margin:'10px'}}>
          你的账号在一台新设备上成功登录。如非本人操作，请及时修改密码。
        </dd>
      </dl>

      <p style={{ fontSize: '15px', textAlign: 'center' }}>4天前</p>
      <dl style={{ display: "flex", justifyContent: "space-around", alignItems: "center" }}>
        <dt>
          <img style={{ width: '50px', height: '50px' }} src="http://172.16.10.111:5886/static/img/head-icon2.png" alt="" />
        </dt>
        <dd style={{margin:'10px'}}>
          你提交的个人资料修改申请审核已经通过。你本月还有修改资料次数:用户简介4次。
        </dd>
      </dl>

    <p style={{ fontSize: '15px', textAlign: 'center' }}>13:29</p>
      <dl style={{ display: "flex", justifyContent: "space-around", alignItems: "center" }}>
        <dt>
          <img style={{ width: '50px', height: '50px' }} src="http://172.16.10.111:5886/static/img/head-icon2.png" alt="" />
        </dt>
        <dd style={{margin:'10px'}}>
          你发表的文章《魅族16s与16sPro降级救砖自主教程》没有审核通过，原因是：含有广告外链 
          点击查看：https://mp.mosi.net/wenzhang/mpfddfjhkh
        </dd>
      </dl>
      
    </div>
  )
}

export default App
